Component({
  options: {
    styleIsolation: 'shared', // 外部 > 组件 > 子组
  },
  properties: {
    outTabsArr: {
      type: Array,
    },

    type: String, //党建中查看详情

    isMy: Boolean, //是否是我的

    curTabIndex: Number, // 当前选中tab索引

    activityType: Object,
  },

  data: {
    refreshing: false, // 监听设为 true 时 ==> 触发refresh事件
    refreshed: false, // true ==> 收起下拉刷新，可多次设置为true（即便原来已经是true了）
    initPage: 1, // 初始 page
    initPageSize: 20, // 默认 pageSize
    tabsArr: [],
  },

  observers: {
    outTabsArr(outTabsArr) {
      let { tabsArr } = this.data
      if (!tabsArr.length) {
        // 首次加载
        tabsArr = outTabsArr
      } else {
        // 仅替换数据，防止丢失 loadMoreView组件实例
        tabsArr.forEach((v, i) => {
          v.dataLists = outTabsArr[i].dataLists
        })
      }
      this.setData({ tabsArr })
    },
  },

  // lifetimes: {
  //   attached: function () {
  //     this.data.tabsArr.forEach((el, key) => {
  //       // 获取页脚 loadMore组件 实例对象
  //       el.loadMoreView = this.selectAllComponents('.loadMoreView')[key]
  //       el.page = this.data.initPage // 当前页码
  //       el.dataLists = [] // 列表数据
  //     })
  //     this.loadData()
  //   },
  // },

  pageLifetimes: {
    show: function () {
      this.data.tabsArr.forEach((el, key) => {
        // 获取页脚 loadMore组件 实例对象
        el.loadMoreView = this.selectAllComponents('.loadMoreView')[key]
        el.page = this.data.initPage // 当前页码
        el.dataLists = [] // 列表数据
      })
      this.loadData()
    },
  },

  methods: {
    // 点击列表中每一项时
    handItem({ detail }) {
      this.triggerEvent('listitem', detail)
    },

    // 点击查看详情 (资讯跳转详情)
    checkDetail({ detail }) {
      this.triggerEvent('checkDetail', detail)
    },

    // 点击加入
    handJoin({ detail }) {
      this.triggerEvent('JoinSocial', detail)
    },

    // tab项切换时
    onChange({ detail }) {
      this.setData({ curTabIndex: detail.index })
      this.triggerEvent('changeTab', detail)
      // 仅在首次加载触发
      if (!this.data.tabsArr[detail.index].isLoaded) {
        this.loadData(this.data.curTabIndex)
      }
    },

    // 下拉刷新 -- pullDownRefresh组件
    onPullDownRefresh() {
      this.data.tabsArr[this.data.curTabIndex].page = this.data.initPage
      this.loadData(this.data.curTabIndex)
      this.setData({ refreshed: true })
    },

    // 触底事件 -- scroll-view组件 主动触发 loadmore组件
    onReachBottom() {
      let { tabsArr, curTabIndex } = this.data
      let activeTab = tabsArr[curTabIndex]
      activeTab.loadMoreView.loadMore()
    },

    /**
     * 加载数据
     * @param {number} curTabIndex 当前选中tab索引
     */
    loadData(curTabIndex = this.data.curTabIndex) {
      let { initPage, initPageSize } = this.data
      // 获取当前tab 相关参数
      let activeTab = this.data.tabsArr[curTabIndex]
      var myEventDetail = {
        activeTab: activeTab,
        initPage,
        initPageSize,
        curTabIndex,
      } // detail对象，提供给事件监听函数
      var myEventOption = {} // 触发事件的选项
      return this.triggerEvent('loaddata', myEventDetail, myEventOption)
    },

    // 实际上拉触底触发事件 -- loadmore组件加载更多事件
    loadMoreListener() {
      let { tabsArr, curTabIndex } = this.data
      tabsArr[curTabIndex].page++
      this.loadData(curTabIndex)
    },

    // 加载失败 --- 点击从新加载
    clickLoadMore() {
      this.loadData(this.data.curTabIndex)
    },
    //#endregion
  },
})
